<!DOCTYPE HTML>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Updated - loading external data into a PhoneGap app using jQuery 1.5</title>
	<script src="js/jquery-1.5.min.js"></script>
	<script type="text/javascript">
	function onClick(){
		var output = $('#output');
		output.text('1238947');
		$.ajax({
			url: 'http://samcroft.co.uk/demos/updated-load-data-into-phonegap/landmarks.php',
			dataType: 'jsonp',
			jsonp: 'jsoncallback',
			timeout: 5000,
			success: function(data, status){
				$.each(data, function(i,item){ 
					var landmark = '<h1>'+item.name+'</h1>'
					+ '<p>'+item.latitude+'<br>'
					+ item.longitude+'</p>';
					
					output.append(landmark);
				});
			},
			error: function(){
				output.text('There was an error loading the data.')
			}
		});
	}
	</script>
</head>
<body>
	<div id="output"></div>
	<input type="button" id="last" value="network" onclick="onClick();" />
</body>
</html>